{include file="common/header"}
<div id="app" v-cloak>
    <div class="el-login-wrapper">
        <div class="container">
            <div class="side">
                <div class="logo">
                    <img src="/admin/images/logo_site.png">OneKeyAdmin
                </div>
                <div class="comments">基于Thinkphp6+Element的通用后台开发框架。一键安装插件/一键安装模板/一键生成代码/一键生成菜单权限/一键生成API接口， 网站、小程序、APP、ERP一个后台框架统统搞定！</div>
                <div class="footer">
                    <a href="{:config('app.api')}" target="_blank">©&nbsp;onekeyadmin.com&nbsp;</a>
                    <a href="{:config('app.api')}/blog.html" target="_blank">论坛专区</a>
                    <a href="{:config('app.api')}/docs.html" target="_blank">帮助文档</a>
                    <a href="{:config('app.api')}/onekey/userDeveloper/index" target="_blank">认证成为开发者</a>
                </div>
            </div>
            <div class="form">
                <div class="title">管理员登录</div>
                <div class="ctitle">ADMIN USER LOGIN</div>
                <el-form :model="loginForm" :rules="rules" ref="loginForm" @submit.native.prevent>
                    <el-form-item prop="account">
                        <el-input v-model="loginForm.account" prefix-icon="el-icon-user" placeholder="请输入账号/邮箱号" @keyup.enter.native="submitForm()">
                        </el-input>
                    </el-form-item>
                    <el-form-item prop="password">
                        <el-input v-model="loginForm.password" prefix-icon="el-icon-key" placeholder="请输入密码" show-password @keyup.enter.native="submitForm()">
                        </el-input>
                    </el-form-item>
                    <el-button @click="submitForm()" :loading="loading" plain>
                        登录
                    </el-button>
                    <div class="footer">
                        <a :href="admin_url('login/passwordEmail')">已有账号，忘记密码？</a>
                    </div>
                </el-form>
            </div>
        </div>
    </div>
</div>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                loading: false,
                loginForm: {
                    account: "",
                    password: "",
                },
                rules: {
                    account: [
                        { required: true, message: "请输入账号", trigger: 'blur' },
                    ],
                    password: [
                        { required: true, message: "请输入密码", trigger: 'blur' },
                    ]
                },
            }
        },
        created() {
            localStorage.token    = null;
            localStorage.userInfo = null;
        },
        methods: {
            /**
             * 点击登录
             */
            submitForm() {
                let self = this;
                this.$refs.loginForm.validate((valid) => {
                    if (valid) {
                        self.loading = true;
                        request.post('login/index', self.loginForm, function (res){
                            self.loading = false;
                            self.$message({ showClose: true, message: res.message, type: res.status});
                            if (res.status === 'success') {
                                top.location.href = admin_url();
                            }
                        })
                    } else {
                        return false;
                    }
                })
            },
        }
    })
</script>
{include file="common/footer"}